<template>
  <div class="">
    <div
      v-if="dataList.length == 0"
      class="full-height black-bg color-white align-center flex justify-center"
    >
      暂无数据
    </div>
    <div
      class="pdsz510 hover-active pointer mrb15 hover-border-active lh28"
      v-for="(item, index) in dataList"
      :key="index"
      @click="getDetail(item)"
    >
      <div class="title-2 text-color">
        {{ item.title }}
      </div>
      <div class="flex justify-between">
        <span
          >单位：<span class="text-color">{{
            getCompanyName(item.companyId)
          }}</span></span
        >
        <span
          >处理人：<span class="text-color">{{ item.dealUser }} </span></span
        >
      </div>
      <div class="flex justify-between">
        <span>
          创建时间：<span class="text-color">{{ item.createTime }} </span></span
        >
        <span
          >预处理时间：<span class="text-color"
            >{{ item.chaoshiTimeStamp }}
          </span></span
        >
        <!-- {{ Date.parse(item.createTime) - Date.parse(item.preConditioningTime) }} -->
      </div>
    </div>
    <!-- 工单详情 -->
    <el-dialog
      :title="dialogContent.title"
      :visible.sync="dialogContent.show"
      :modal="true"
      v-dialogDrag
      width="650px"
      append-to-body
      :close-on-click-modal="false"
      custom-class="widget-dialog absolute center no-margin color-white  dalog-ui"
    >
      <div class="relative full-width minH350" v-if="dialogContent.show">
        <WidgetFromDetail
          :lastFormData="lastFormData"
          :lastFormList="lastFormList"
          :topFormData="topFormData"
          :topFormList="topFormList"
          :formbox="formbox"
          :workList="workList"
        />
      </div>

      <template slot="footer">
        <div class="text-center full-width">
          <el-button
            class="button-ui pdbtn color-active-ui button-panel button-cancel"
            @click="dialogContent.show = false"
            >返回</el-button
          >
        </div>
      </template>
    </el-dialog>
  </div>
</template>
<script>
import {
  workOrderBaoJingList,
  workOrderGetById,
  sysGetUserListByUserName
} from "@/api";
import {
  editRule,
  chuliForm,
  checkPlayForm,
  shenheForm,
  regionFrom,
  instaShotForm
} from "@/formRules/system/WorkSelfRules";
import { mapState } from "vuex";
import WidgetFromDetail from "@/components/Widget/WidgetFrom/WidgetFromDetail.vue";
import baseUrl from "@/api/request/url";
import { editFormOptions, getData } from "@/formRules";
export default {
  components: { WidgetFromDetail },
  data() {
    return {
      dataList: [],
      searchData: {
        userName: "zonghe02"
      },
      dialogContent: {
        title: "工单详情",
        show: false
      },
      nowData: {},
      lastFormData: {},
      lastFormList: [],
      topFormList: [],
      topFormData: {},
      formbox: {
        editOptions: editFormOptions(),
        editData: {},
        editRule: editRule()
      },
      checkEvent: {}
    };
  },
  computed: {
    ...mapState(["user", "isAdmin", "companyList"]),
    userName() {
      return this.user.username;
    }
  },
  mounted() {
    this.getBaoJing();
  },
  methods: {
    getCompanyName(id) {
      return this.companyList.filter(i => i.value == Number(id))[0].label;
    },
    async getBaoJing() {
      let { data } = await workOrderBaoJingList(this.searchData);
      this.dataList = data;
    },
    async getDetail(item) {
      this.formbox = item;

      this.nowData = item;
      let { data } = await workOrderGetById({
        hiddenDangerOrderId: item.orderId
      });
      this.dangerDetail = data.responeHiddenDangerOrder; //当前隐患详情
      this.formData = data.responeHiddenDangerOrder;
      this.workList = data.responeHiddenDangerWorkList; //workList列表
      this.isType = this.dangerDetail.state; //当前状态
      if (Number(this.isType) == 0) {
        this.formList = chuliForm();
        this.topFormList = chuliForm();
        this.checkPlayForm = checkPlayForm();
        sysGetUserListByUserName({
          userName: this.userName
          // eventId:this.dangerDetail.eventId
        }).then(({ data }) => {
          let changeData = [];

          data.forEach(e => {
            changeData.push(e.userName);
          });
          this.checkPlayForm.forEach(element => {
            if (element.type_Persons) {
              element.options = changeData;
            }
          });
        });
      } else if (Number(this.isType) == 1) {
        this.formList = chuliForm();
        this.topFormList = chuliForm();
      } else {
        this.formList = shenheForm();
        this.topFormList = shenheForm();
      }
      this.formList.forEach(e => {
        //不可选状态
        e.disabled = true;
      });
      //   获取描述
      this.checkEvent = data.checkEvent;

      this.lastFormList = regionFrom().concat(instaShotForm());

      this.lastFormData.createUser =
        this.checkEvent?.createUser || "暂无发布人";
      this.lastFormList.forEach(e => {
        //不可选状态
        e.disabled = true;
      });
      let checkEventDetailList = this.checkEvent.checkEventDetailList;
      if (checkEventDetailList && checkEventDetailList.length) {
        checkEventDetailList.forEach(e => {
          if (e.type == "FormListImageFile") {
            let fileVal = JSON.parse(e.val),
              fileList = [];
            if (!fileVal) {
              return;
            }
            if (fileVal.length) {
              fileList = fileVal;
            }
            this.lastFormData[e.keyId] = fileList;
          } else {
            this.lastFormData[e.keyId] = JSON.parse(e.val)[0];
          }
        });
      }
      let {
        companyName,
        propertyName,
        createUser,
        deviceName,
        baozhangName,
        baozhangAddress,
        address,
        bumenName,
        gangWei
      } = this.checkEvent;
      this.$nextTick(() => {
        this.lastFormData.propertyName = propertyName || "暂无绑定";
        this.lastFormData.companyName = companyName || "暂无单位";
        this.lastFormData.deviceName = deviceName || "暂无绑定";
        this.lastFormData.createUser = createUser || "暂无发布人";
        this.lastFormData.createCustomName = baozhangName || "未命名";
        this.lastFormData.address = baozhangAddress || "无";
        this.lastFormData.bumenName = bumenName || "无";
        this.lastFormData.gangWei = gangWei || "无";
        this.dialogContent.show = true;
      });
    }
  }
};
</script>
<style lang="sass"></style>
